<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- div body html document window -->
    <div>啊撒旦发生的发</div>
    <ul>
        <li>abc1</li>
        <li>abc2</li>
        <li>abc3</li>
    </ul>

    <script>

        /* 
            全局作用域 
                this => window

            局部作用域 
                只有函数才有局部作用域

                普通函数
                    函数内 this => window
                对象内的函数
                    函数内  this=> 对象本身 
                定时器 
                    函数内  this => window  
                    setTimout 和 setInterval 都是 
                事件处理函数
                    函数内  this 绑定在谁的身上 谁就是this
                     
        
        
        
        
        */
        // alert(this);// 全局作用域 是 window  this在全局作用域下  
        // this 就是window

        // var num = 100;
        // function  test(){
        //     var num = 200;
        //     console.log(this.num); // 这里this 代表的window
        //     // 所以结果是100 
        // }

        // // test();

        // var obj = {
        //     name:'张三',
        //     age:18,
        //     sing:function(){
        //         console.log(this);  // this代表对象本身  
        //         // {name: '张三', age: 18, sing: ƒ}
        //     }
        // }

        // alert(obj.name);
        // obj.sing();


        // function test1(){
        //     console.log('666')
        //     console.log(this); // 定时器中函数的this 代表 window 
        // }



        // setTimeout(test1,1000);


        // function test2(){
        //     console.log('我是事件处理函数');
        //     console.log(this); // this 代表的是事件源 
        // }

        // // window.onclick = test2; // this 是window
        // // document.onclick = test2; // this 是document
        // document.querySelector('div').onclick = test2;
        // // 给谁绑定 this 代表谁 
        document.querySelector('ul').onclick = function(){
            console.log(this.nodeName);
        }

        // 点击任何li  this 都是  ul元素 
        // 因为绑定的就是ul 

        (function(){
            console.log(this);
        })()
    </script>
</body>
</html>